<template>
  <div style="width:600px;margin:0 auto">
    <tree-node
      :node="nodeData"
      node-key="id"
      label-key="clickCount"
      :expandAll="true"
      @node-item-click="click"
    />
  </div>
</template>
<script>
import TreeNode from "../components/TreeNode.vue";
export default {
  components: {
    TreeNode,
  },
  data() {
    return {
      nodeData: [],
    };
  },
  created() {
    this.initMockData();
  },
  methods: {
    async initMockData() {
      //fetch拦截不到
      //   const request = await fetch("/tree");
      //   const res = await request.json();
      const res = await this.$api.get("/tree");
      this.nodeData = res.data;
    },
    click({ data }) {
      console.log(`id: ${data.id}  click:${data.clickCount}`);
    },
  },
};
</script>
